<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Theme Editor</title>


<script type="text/javascript" src="/maqetta/app/static/lib/dojo/1.7/dojo/dojo.js"
	djConfig="parseOnLoad: true"></script> 
<script type="text/javascript">
    dojo.require("dojo.parser");
    dojo.require("dijit.dijit"); // optimized layer for loading
    dojo.require("dijit.form.Button");
    dojo.require("dijit.Toolbar");
    dojo.require("dijit.form.CheckBox");
    dojo.require("dijit.form.ComboBox")
    dojo.require("dijit.form.TextBox");
    dojo.require("dijit.Calendar");
    dojo.require("dijit.layout.TabContainer");
    dojo.require("dijit.layout.ContentPane");
    dojo.require("dijit.layout.AccordionContainer");
    dojo.require("dijit.TitlePane");
    dojo.require("dijit.layout.BorderContainer");
    
</script>

</head>
<body class="sketch">
	
	<style>
		body {
			padding:5px;
			margin:0;
		}
		.theming-group {
			padding:0;
			padding-top:.3em;
			padding-bottom:0;
			border-spacing:0;
		}
		.theming-group-title {
			color:#333;
			font-family:cursive;
			background-color:#aaa;
			padding-left:.3em;
		}
		.theming-group-widgets {
			padding:0;
		}
		#other-widgets {
			width:40em;
		}
		#SampleContentPane {
			width: 200px; 
			overflow: hidden;
		}
		#SampleAccordionPane {
			width: 200px; 
			height: 150px; 
		}
		#SampleTabContainer {
			width: 175px; 
			height: 150px;
		}
		.widget-sample {
			margin-left:.3em;
			margin-right:.3em;
			margin-top: .3em;
			margin-bottom: .1em;
		}
	</style>
	<div class="theming-group">
		<div class="theming-group-title">
			Global Styling
		</div>
		<div class="theming-group-widgets">
			<div class="widget-sample">
				<label id="label_0"  class='dvThemeWidget'>
					Generic text: Click on this text block to set defaults for various inheritable
					properties, such as font properties.
				</label>
			</div>			
		</div>
	</div>
	<div class="theming-group">
		<div class="theming-group-title">
			Primitive Widgets
		</div>
		<div class="theming-group-widgets">
			<table role="presentation">
				<tbody>
					<tr valign="top">
						<td style="width:150px">
							<div class="widget-sample">
								<button type="button" dojoType="dijit.form.Button" id="1465"
									value="Button"  class='dvThemeWidget'>Button</button>
							</div>
							<div>
								<input dojoType="dijit.form.CheckBox"
									type="checkBox"  class='dvThemeWidget'>CheckBox</input>
							</div>
							<div dojoType="dijit.Menu" id="windowContextMenu" contextMenuForWindow="false" class='dvThemeWidget' >
								<div dojoType="dijit.CheckedMenuItem" >
									CheckedMenuItem
								</div>
								<div dojoType="dijit.MenuSeparator">
								</div>
								<div dojoType="dijit.PopupMenuItem" >
									<span>
										Popup Submenu
									</span>
									<div dojoType="dijit.Menu" id="submenu1">
										<div dojoType="dijit.MenuItem">
											Submenu Item One
										</div>
                                    </div>
								</div>	
							</div>
							
						</td>
						<td>
							<div class="widget-sample">
								<div dojoType="dijit.Calendar"  class='dvThemeWidget'
									datePackage="dojo.date"
									value="now"
									style="-moz-user-select: none;"></div>
							</div>
						</td>
						<td>
							<div dojoType="dijit.Toolbar"  class='dvThemeWidget'
								isContainer="true" >
								<input dojoType="dijit.form.Button"
									type="dijit.form.Button"
									tabIndex="-1"
									label="Tool 1">
								</input>
								<input dojoType="dijit.form.Button"
									type="dijit.form.Button"
									tabIndex="-1"
									label="Tool 2">
								</input>
							</div>
							<div id="widget-sample-TextBox" class="widget-sample">
								<input type="text" dojoType="dijit.form.TextBox" id="firstname"
									name="myTextBox"
									value="TextBox (text input widget)"
									trim="true"
									style="width:15em"
									 class='dvThemeWidget'></input>
							</div>
							<select dojoType="dijit.form.ComboBox"  class='dvThemeWidget'
									type="dijit.form.ComboBox"
									value="TextBox subwidget"
									constraints="{}"
									fetchProperties="{}"
									>
									<option value="1">Item 1</option>
									<option value="2">Item 2</option>
									<option value="3">Item 3</option>
							</select>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
	<div class="theming-group">
		<div class="theming-group-title">
			Container Widgets
		</div>
		<div class="theming-group-widgets">
			<table role="presentation">
				<tbody>
					<tr valign="top">
						<td>
							<div class="widget-sample">
								<div dojoType="dijit.layout.ContentPane" id="SampleContentPane"  class='dvThemeWidget'
									doLayout="true"
									style="width: 163px; height: 175px;"
									ioArgs="{}">ContentPane for Content Pane</div>
							</div>
						</td>
						<td>
							<div class="widget-sample">
								<div dojoType="dijit.layout.AccordionContainer" id="SampleAccordionPane"  class='dvThemeWidget'
									duration="200" style="width: 163px; height: 175px;">
									<div dojoType="dijit.layout.ContentPane"
										title="Accordion - Pane 1"
										doLayout="true"
										errorMessage="&lt;span class='dijitContentPaneError'&gt;Sorry, an error occurred&lt;/span&gt;"
										ioArgs="{}"
										loadingMessage="&lt;span class='dijitContentPaneLoading'&gt;Loading...&lt;/span&gt;"
										selected="true">ContentPane for Accordion Pane 1.</div>
									<div dojoType="dijit.layout.ContentPane"
										title="Accordion - Pane 2"
										doLayout="true"
										errorMessage="&lt;span class='dijitContentPaneError'&gt;Sorry, an error occurred&lt;/span&gt;"
										ioArgs="{}"
										loadingMessage="&lt;span class='dijitContentPaneLoading'&gt;Loading...&lt;/span&gt;"
										selected="true">ContentPane for Accordion Pane 2.</div>
									
								</div>
							</div>
						</td>
						<td>
							<div dojoType="dijit.layout.TabContainer" id="SampleTabContainer"  class='dvThemeWidget'
								tabStrip="true" style="width: 163px; height: 175px;">
								<div dojoType="dijit.layout.ContentPane"
									title="Tab 1"
									doLayout="true"
									ioArgs="{}"
									selected="true"
									style="left: 0px; top: 0px; width: 163px; height: 112px;">ContentPane for TabContainer Pane 1.</div>
								
							</div>
						</td>
					</tr>
					<tr>
						<td>
							<div dojoType="dijit.TitlePane"  class='dvThemeWidget'
								title="Pane"
								doLayout="true"
								duration="200"
								open="true"
								ioArgs="{}"
								style="width: 163px; height: 175px;">Content for TitlePane Widget.</div>
						</td>
						<td>
							<div dojoType="dijit.layout.BorderContainer"  class='dvThemeWidget'
								design="sidebar"
								gutters="true"
								style="width: 163px; height: 175px;">
								<div dojoType="dijit.layout.ContentPane"
									doLayout="true"
									ioArgs="{}"
									region="top"
									splitter="true"
									>
									ContentPane for BorderContainer.
								</div>
								<div dojoType="dijit.layout.ContentPane"
									doLayout="true"
									ioArgs="{}"
									region="left"
									splitter="true"
									>
								</div>
								<div dojoType="dijit.layout.ContentPane"
									doLayout="true"
									ioArgs="{}"
									region="center"
									>
									ContentPane for BorderContainer.
								</div>
							</div>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>

</body>
</html>